

{% extends 'blog/base.html' %}
{% load static %}
{% load blog_tags %}
{% load highlight %}

{% block title %} {{ article.title }} {% endblock %}

{% block extra_head %}
    <link rel="stylesheet" href="{% static 'css/markdown.css' %}">
    <link rel="stylesheet" href="{% static 'css/code.css' %}">
    <script src="{% static 'js/highlight.min.js' %}"></script>
    <script>
        hljs.initHighlightingOnLoad();
    </script>
    <style>
        span.highlighted {
            color: red;
        }
    </style>
{% endblock %}

{% block main %}
    <hr/>
    <form class="form-control clearfix" action="/search/" method="get">
        <span class="text-muted mr-2">使用 es 搜索:  </span>
        <input class="form-control mr-sm-2" type="text" name="q" placeholder="Search" aria-label="Search" value="{{query}}" autofocus="autofocus"/>
        <button class="btn btn-primary float-right" type="submit">搜索</button>
    </form>
    <hr/>

    {% if query %}
    <h3>搜索 "<span class="highlighted">{{query}}</span>" 结果如下：</h3>
    <hr/>
        {% for result in page.object_list %}
            <a href="{% url 'blog:article-detail' result.object.id %}">{{ result.object.title }}</a> | {% highlight result.object.desc with query %}<br/>
            <hr/>
            {% empty %}
            <p>啥也没找到</p>

        {% endfor %}

        {% if page.has_previous or page.has_next %}
            <div>
                {% if page.has_previous %}
                    <a href="?q={{ query }}&page={{ page.previous_page_number }}">{% endif %}« 上一页
                {% if page.has_previous %}</a>{% endif %}
                |
                {% if page.has_next %}<a href="?q={{ query }}&page={{ page.next_page_number }}">{% endif %}下一页 »
                {% if page.has_next %}</a>{% endif %}
            </div>
        {% endif %}
    {% endif %}
{% endblock %}
